<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <div id="div1">
        <!-- <div>{{num}}</div>
        <button v-on:click='num++'>点击</button>
        <button @click='num++'>点击1</button>
        <div @click='handle0'>
            <button @click.stop='handle2(123,456,$event)'>点击2</button>
        </div>
        <a href="#" @click.prevent='handle1'>a链接</a>
        <button @click='handle1'>点击3</button>

        <form action="">
            <input type="text" v-model='username' @keyup.delete='remove'>
            <input type="password" v-model='password' @keyup.enter='submitab'>
            <input type="button" @click='submitab' value="提交">
            <input type="text" @keyup.65='keya' value="按键"> -->

           数值a: <input type="text" name="" id="" v-model='numa'>
           数值b <input type="text" name="" id="" v-model='numb'>
                <button @click='results'>计算</button>
            计算结果：<span v-text='sum'></span>
            <input type="text" v-model='suns' value="数据绑定" @keyup='values'>
            数据绑定：<span v-text='suns'></span>
            
        <!-- </form> -->
            
    </div>


    
    <script src="./js/vue.js"></script>
    <script type="text/javascript">
        let vm = new Vue({
            el: '#div1',
            data: {
                // num:0,
                // username:'',
                // password:'',
                numb:'',
                numa:'',
                sum:'',
                suns:''
            },
            methods:{
                // handle2:function(a,b,event){
                //     console.log(a,b);
                //     console.log(event.target.innerHTML);
                //     // event.stopPropagation()
                   
                // },
                // handle1:function(event){
                //     console.log(event.target.tagName);
                // },
                // handle0:function(){
                //     this.num++
                // },
                // submitab:function(){
                //     console.log(this.username,this.password);
                // },
                // remove:function(){
                //     this.username = ''
                // },
                // keya:function(event){
                //     console.log(event.keyCode);
                // },
                results:function(){
                    this.sum = parseInt(this.numa) + parseInt(this.numb)
                },
                values:function(event) {
                    this.suns = ''
                }

            }
        })
    </script>
</body>
</html>